<template>
	<view class="newsDetails">
		<view class="newsContent">
			<!-- 新闻标题 -->
			<view class="newsTitle">
				<text class="newsText">{{data.newsList.title}}</text>
			</view>
			<view class="newbox">
				<view class="click">
					{{data.newsList.click}}次浏览
				</view>
				<view class="time" v-if="data.newsList.CreatedAt">
					发布时间：{{$clearTime(data.newsList.CreatedAt)}}
				</view>
			</view>
			<!-- 新闻详情 -->
			<view style="padding: 20upx;">
				<view v-html="data.newsList.content"></view>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {ref,reactive,getCurrentInstance} from "vue";
	import {onLoad,onShow} from "@dcloudio/uni-app";
	const {proxy} = getCurrentInstance();
	let data =reactive({
		newsID:0,
		newsList:{},	//新闻详情
	})
	onLoad((option) => {
		data.newsID = option.id
	})
	onShow(() => {
		console.log('页面onShow')
		newsDetail()
	})
	// 新闻详情
	function newsDetail(){
		proxy.$request({
			url:`api/newsList/${data.newsID}/`,
			method:'POST',
			success:(res)=>{
				if(res.errno == 0){
					data.newsList = res.data
				}
			}
		})
	}
</script>

<style lang="scss" scoped>
		@import "https://unpkg.com/@wangeditor/editor@latest/dist/css/style.css";
	page{
		background: #fff;
		
	}
	.newsContent{
		width: 100%;
		overflow: hidden;
		padding-bottom: 30upx;
		.newsTitle{
			margin: 40rpx 0;
			padding: 20upx;
		}
		.newbox{
			display: flex;
			justify-content: space-between;
			color: #999;
			font-size: 12px;
			padding: 20upx;
			border-bottom: 20upx solid #f5f5f5;
		}
		.newsText{
			font-size: 36rpx;
			font-family: PingFang SC, PingFang SC-Bold;
			font-weight: 700;
			text-align: left;
			color: #333333;
			letter-spacing: 1rpx;
		}
	}
	
</style>
<style>
	page{
		background-color: #fff;
	}
</style>
